/**
 * Created by zhaoxk on 2017/2/24.
 */
import React from 'react';
import _ from 'lodash';
import { List } from 'antd-mobile';
import { diffTimer, carryFN } from '../../../utils';
import styles from './index.less';

const Item = List.Item;
const icons = {
    information: require('../../../assets/resource/information.svg'),
    history: require('../../../assets/resource/history.svg'),
    sign: require('../../../assets/resource/sign.svg'),
    suggest: require('../../../assets/resource/suggest.svg'),
    bodyInspect: require('../../../assets/resource/bodyInspect.svg'),
    inspect: require('../../../assets/resource/inspect.svg'),
    check: require('../../../assets/resource/check.svg'),
    operator: require('../../../assets/resource/operator.svg'),
    cost: require('../../../assets/resource/cost.svg'),
};

function InfoBoard({
    information: {
        name,
        age,
        gender,
        bedNumber,
        code,
        departmentName,
        entryDate,
        doctor = '林医生',
    }
}) {
    const day = diffTimer({
        from: entryDate,
    });

    return (
        <div className={styles.infoBoard}>
            <h1>{name}<span>({gender === '1' ? '男' : '女'} {age})</span></h1>
            <ul className={styles.infoOverview}>
                <li><span>床号：</span>{bedNumber}</li>
                <li><span>住院号：</span>{code}</li>
                <li><span>入院日期：</span>{entryDate} 第{day}天</li>
                <li><span>科室：</span>{departmentName}</li>
                <li><span>主治医生：</span>{doctor}</li>
            </ul>
        </div>
    );
}
function Items({ menu, changeItem }) {
    const clickHandler = (key) => (e) => {
        e.preventDefault();
        carryFN(changeItem, key);
    };
    const lis = _.map(menu, (li) => (
        <Item
            key={li.value}
            thumb={icons[li.value]}
            onClick={clickHandler.bind(null, li.value)()}
        >
            {li.label}
        </Item>
    ));
    return (
        <List>
            {lis}
        </List>
    );
}

function PatientLeft({ patient, changeItem }) {
    const { information, menu } = patient;
    if (information) {
        return (
            <div className={styles.PatientLeft}>
                <InfoBoard
                    information={information}
                />
                <Items
                    menu={menu}
                    changeItem={changeItem}
                />
            </div>
        );
    } else {
        return (
            <div>没有合法患者信息，请返回患者列表</div>
        );
    }
}

export default PatientLeft;
